
<template>
   
  <div class="shop" v-loading='loading'>
    <div style="float:right">
      <FormSearch
        ref="formSearch"
        :forms="searchForm"
        @handleSearch="handleSearch"
        @handleReset="handleReset"
      />
    </div>
    <el-table
      class="table-box"
      :data="tableData"
      style="width:100%"
      :max-height="screenHight"
      :cell-style="tc"
      :header-cell-style="tccolor"
    >
      <el-table-column label="提现时间">
        <template slot-scope="scope">
          <span> {{parseTime(scope.row.createTime)}}</span>
         </template>
      </el-table-column>
      <el-table-column prop="withdraw_type" label="提现银行|收款账号">
        <template slot-scope="scope">
          <div>
            {{ scope.row.withdrawTypeText }}|{{ scope.row.withdrawAccount }}
          </div>
        </template>
      </el-table-column>
      <el-table-column prop="amount" label="提现金额(元)"></el-table-column>
      <el-table-column label="代扣税率" prop="rate">
        <template slot-scope="scope">
          <div>
            {{ scope.row.rate }}%
          </div>
        </template>
      </el-table-column>
      <el-table-column label="状态" prop="statusText">
      </el-table-column>
    </el-table>
    <el-col :span="24">
      <div class="pagination">
        <el-pagination
          background
          @size-change="handleSizeChange"
          @current-change="pageChange"
          :current-page="query.pageNum"
          :page-size="query.pageSize"
          :page-sizes="[20]"
          layout="total, sizes, prev, pager, next, jumper"
          :total="total"
        ></el-pagination>
      </div>
    </el-col>
  </div>
</template>

<script>
import FormSearch from '@/components/FormSearch'
import { getWithdrawList } from '@/api/income'
export default {
  components: {
    FormSearch
  },
  data() {
    return {
      loading:false,
      total: 0,
      createTime: [],
      tableData: [],
      form: {},
      page: 1,
      size: 20,
      query:{
        pageNum:1,
        pageSize:20,
        startDate:'',
        endDate:'',
        memberId:sessionStorage.getItem("memberId"),
        uid:sessionStorage.getItem("memberId"),
        // keyword:'',
        // partnerId:0,
        // sellerId:0,
        // shopTypeId:0,
        // shopStatus:0,
        // shopName:'',
        // search:'',

      },
      searchForm: {
        form: [
          {
            type: 'datePicker',
            rangeType: 'datetimerange',
            format: 'yyyy-MM-dd HH:mm:ss',
            valueFormat: 'yyyy-MM-dd HH:mm:ss',
            key: 'createTime',
            label: '提现时间:'
          }
        ]
      }
    };
  },
  created(){
    this.getData({
      page: 1
    })
  },
  methods: {
    getData(params) {
      this.loading = true
      console.log(this.query,'query')
      getWithdrawList(this.query).then(res => {
        if (res.code === 200) {
          this.loading = false
          // res.data.data.forEach(item => {
          //   item.status = item.status === 0 ? '审核中' : item.status === 1 ? '提现成功' : '拒绝'
          //   item.withdraw_type = item.withdraw_type === 1 ? '支付宝' : item.status === 5 ? '银行卡' : '微信'
          // })
          this.tableData = res.data.list
          this.total = res.data.total
        }
      })
    },
    handleSizeChange() {
    },
    pageChange(page) {
      this.query.pageNum = page
      const params = {
        page: page,
        ...this.form
      }
      if (params.createTime) {
        params.start_time = params.createTime[0]
        params.end_time = params.createTime[1]
        delete params.createTime
      }
      this.getData()
    },
    handleSearch(formValue) {
      this.query.pageNum = 1
      console.log(formValue)
      if(formValue.createTime){
        this.query.startDate = formValue.createTime[0]
        this.query.endDate = formValue.createTime[1]
        this.getData()
      }

      // if (formValue.createTime) {
      //   formValue.start_time = formValue.createTime[0]
      //   formValue.end_time = formValue.createTime[1]
      //   delete formValue.createTime
      // }
      // this.form = formValue
      // const params = {
      //   ...formValue,
      //   page: this.page
      // }
      
    },
    handleReset() {
      this.query.pageNum = 1
      this.query.startDate=''
      this.query.endDate=''
      // this.form = {}
      // const params = {
      //   page: this.page
      // }
      this.getData()
    },
    tc() {
      return 'text-align:center; color:#333333; font-size:12px;'
    },
    tccolor() {
      return 'text-align:center;background-color:#f5f5f5; font-size:14px;'
    }
  }
};
</script>

<style lang="scss" scoped>
.shop {
  position: relative;
  background-color: #fff;
  height: 100%;
  padding: 10px 20px 0 ;
  box-sizing: border-box;
  .table-box {
    height: calc(100vh - 220px);
  }
  .pagination {
    position: absolute;
    bottom: 10px;
    right: 20px;
    z-index: 99;
  }
}
</style>